<template>
  <!-- 岗位绑定角色 表单页面 -->
  <div v-if="crud.status.cu > 0">
    <el-drawer
      :title="crud.status.title"
      :visible.sync="crud.status.cu > 0"
      direction="rtl"
      :before-close="crud.cancelCU"
      :wrapper-closable="false"
      size="400px"
    >
      <div class="leisure-drawer__content">
        <el-form
          ref="form"
          :model="form"
          :rules="rules"
          size="small"
          label-width="100px"
        >
          <el-form-item label="岗位id" prop="stationId">
            <el-input v-model="form.stationId" placeholder="请输入岗位id" clearable />
          </el-form-item>
          <el-form-item label="角色id" prop="roleId">
            <el-input v-model="form.roleId" placeholder="请输入角色id" clearable />
          </el-form-item>
        </el-form>

        <div class="leisure-drawer__footer">
          <el-button
            @click="crud.cancelCU"
          >
            取消
          </el-button>
          <el-button
            :loading="crud.status.cu === 2"
            type="primary"
            @click="crud.submitCU"
          >
            确认
          </el-button>
        </div>
      </div>
    </el-drawer>
  </div>
</template>

<script>
import CRUD, { form } from '@crud/crud'
// 岗位绑定角色 - model
const defaultForm = {
  id: null, // id
  stationId: null, // 岗位id
  roleId: null, // 角色id
  createUser: null
}
export default {
  mixins: [form(defaultForm)],
  dicts: [
    'common_status'
  ], // 字典
  data() {
    return {
      rules: {
        paixu: [
          { required: true, message: '请输入序号', trigger: 'blur', type: 'number' }
        ]
      }
    }
  },
  mounted() {
  },
  methods: {
    [CRUD.HOOK.beforeToCU]() {

    }
  }
}
</script>

<style lang="scss" scoped>
  /deep/ .el-input-number .el-input__inner {
    text-align: left;
  }

</style>
